<template>
  <Content title="查看">
    <view class="maintenance-hall-view-box">
      <view class="repair-report">
        <view class="title">报修信息</view>
        <view class="model-box">
          <text class="box-item">班组：甲（A）</text>
          <text class="box-item">班次：早班</text>
          <text class="box-item">报修人：张三</text>
          <text class="box-item">报修人电话：18888888888</text>
          <text class="box-item">冲床编号：001</text>
          <text class="box-item">压机编号：001</text>
          <text class="box-item">焊机编号：001</text>
          <text class="box-item">冲速：1455</text>
          <text class="box-item">冲压材料：001</text>
          <text class="box-item">冲压用油：xxxxx</text>
          <text class="box-item">紧急程度：XXX</text>
          <text class="box-item">是否复样：是</text>
          <text class="box-item">异常现象：xxxxxxxxxxxxxxxxxxxxx</text>
          <view class="box-item file"
            >附件信息：<img
              src="https://uviewui.com/common/weixin_mini_qrcode.png"
          /></view>
          <text class="box-item">生产确认人：001</text>
          <text class="box-item">品质确认人：xxx</text>
          <text class="box-item">模具确认人：xx</text>
          <text class="box-item">拆模类型：试模NG</text>
        </view>
      </view>

      <view class="exception-description">
        <view class="title">模具（产品）异常描述</view>
        <view class="model-box">
          <text class="box-item">生产部：xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</text>
          <text class="box-item">品质部：xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</text>
        </view>
      </view>

      <view class="mold-Information">
        <view class="title">模具信息</view>
        <view class="model-box">
          <text class="box-item">模具名称：甲（A）</text>
          <text class="box-item">模具编号：早班</text>
          <text class="box-item">具体位置：张三</text>
        </view>
      </view>

      <view class="work-time">
        <view class="title">工单时间</view>
        <view class="model-box">
          <text class="box-item">故障发生时间：XXXXXXX</text>
          <text class="box-item">故障发生时间：XXXXXXX</text>
          <text class="box-item">拆模时间：XXXXXXX</text>
          <text class="box-item">模具送达时间：XXXXXXX</text>
          <text class="box-item">模具收货时间：XXXXXXX</text>
          <text class="box-item">开始维修时间：XXXXXXX</text>
          <text class="box-item">结束维修时间：XXXXXXX</text>
          <text class="box-item">维修总时长：XXXXXXX</text>
          <text class="box-item">（代装）生产停止时间：XXXXXXX</text>
          <text class="box-item">最总审核时间：XXXXXXX</text>
        </view>
      </view>

      <view class="maintenance-information">
        <view class="title">维修信息</view>
        <view class="model-box">
          <text class="box-item">故障部位：xxxx</text>
          <text class="box-item">故障类型：xxxxxxx</text>
          <text class="box-item">部件：xxx</text>
          <text class="box-item">故障现象：xxxxxxxxxxxxxxxxxxxxxxxxxxx</text>
          <text class="box-item">故障原因：xxxxxxxxxxxxxxxxxxxxxxxxxxx</text>
          <text class="box-item">维修处置结果：xxxxxxxxxxxxxxxxxxx</text>
          <text class="box-item">维修人：xxxxxx</text>
          <view class="box-item file"
            >附件信息：<img
              src="https://uviewui.com/common/weixin_mini_qrcode.png"
          /></view>
          <text class="box-item">协助维修人：张三、李四、王五</text>
        </view>
      </view>

      <view class="using-materials">
        <view class="title">使用物料</view>
        <MyTable :columns="materialColumns" :dataSource="materialData" />
      </view>

      <view class="upgrade-record">
        <view class="title">升级记录</view>
        <MyTable :columns="upgradeColumns" :dataSource="upgradeData" />
      </view>

      <view class="maintenance-rating">
        <view class="title">维修评分</view>

        <view class="model-box">
          <view class="all-item">
            <text>服务态度评分：</text>
            <uni-rate :max="5" v-model="model.rate" disabled />
          </view>
          <view class="all-item">
            <text>技术能力评分：</text>
            <uni-rate :max="5" v-model="model.rate1" disabled />
          </view>
          <view class="all-item">
            <text>响应速度评分：</text>
            <uni-rate :max="5" v-model="model.rate2" disabled />
          </view>
          <text class="all-item">评语：优秀</text>
        </view>
      </view>
    </view>
  </Content>
</template>

<script>
import Content from "@/components/content/index.vue";
import MyTable from "@/components/myTable.vue";
export default {
  components: {
    Content,
    MyTable,
  },
  data() {
    return {
      id: "",
      model: {
        rate: 2,
        rate1: 3,
        rate2: 5,
      },
      materialColumns: [
        {
          title: "物料号",
          key: "a",
        },
        {
          title: "品名",
          key: "s",
        },
        {
          title: "规格",
          key: "d",
        },
        {
          title: "数量",
          key: "f",
        },
      ],
      materialData: [
        {
          id: "1",
          a: "2",
          s: "3",
          d: "4",
          f: "5",
        },
      ],
      upgradeColumns: [
        {
          title: "升级等级",
          key: "a",
        },
        {
          title: "状态",
          key: "s",
        },
        {
          title: "升级内容",
          key: "d",
        },
        {
          title: "升级时间",
          key: "e",
        },
        {
          title: "升级人员",
          key: "f",
        },
      ],
      upgradeData: [
        {
          id: "1",
          a: "2",
          s: "3",
          d: "4",
          f: "5",
        },
      ],
    };
  },
  onLoad: function (option) {
    //option为object类型，会序列化上个页面传递的参数
  },
  onShow: function () {},
  mounted() {},
  methods: {
    close() {},
    submit() {},
  },
};
</script>

<style scoped lang="scss">
.maintenance-hall-view-box {
  background-color: #fff;
  min-height: 100%;
  padding: 40rpx;
  .title {
    font-size: 40rpx;
    margin-bottom: 20rpx;
  }
  .repair-report,
  .exception-description,
  .mold-Information,
  .work-time,
  .maintenance-information,
  .using-materials,
  .upgrade-record {
    margin-bottom: 20rpx;
  }
  .model-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    .box-item {
      min-width: 30%;
      margin-bottom: 20rpx;
      font-size: 28rpx;
      img {
        width: 200rpx;
        margin: 0;
      }
    }
    .all-item {
      width: 100%;
      display: flex;
      margin-bottom: 20rpx;
    }
    .file {
      width: 100%;
      min-width: 100%;
      display: flex;
      align-items: flex-start;
    }
  }
}
</style>
